<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>滚动边界检查</title>
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="css/ScrollLoad.css">
</head>
<body>

<style>
    .container {
        width: 200px;
        height: 300px;
        border: 1px solid red;
        margin: 20px;
        overflow: hidden;
        overflow-y: auto;
    }

    .container .con {
        height: 600px;
        background-color: green;
    }
</style>
<div class="container">
    <div class="con"></div>
</div>

<script src="../SmallJs/SmallJs.js"></script>
<script src="js/Boundary.js"></script>
<script>
    var con = G('.container');
    var fn = new Boundary('.container' , {
        once: true ,
        top: function(){
            console.log('滚动到顶部');
        } ,
        bottom: function(){
            console.log('滚动到底部');
        } ,
        scroll: function(){
            console.log('滚动中');
        }
    });
</script>
</body>
</html>